<template>
	<view class="container">
		<view class="status-bar"></view>
		<view class="body">
			<textarea v-model="content" placeholder="请输入内容" class="content" /><br>
			<view class="items">
				<view class="item flex-row">
					<view class="flex-row">
						<uni-icons type="settings" color="#666" size="18"></uni-icons>
						<text class="label">选择商品</text>
					</view>
					<view class="flex-row" @click="iShow">
						<text class="value">点击选择</text>
						<uni-icons type="arrowright" color="#999" size="18"></uni-icons>
					</view>
					<view>
						<u-picker v-model="show" :range="selector" range-key="cateName" mode="selector" @confirm="confirm"></u-picker>
					</view>
				</view>
			</view>
			<u-button type="primary" size="medium" ripple-bg-color="#FA436A" plain @click="TowFaBu()">发布</u-button>
		</view>
	</view>
</template>

<script>
import uniPopup from '@/components/uni-popup/uni-popup.vue'
export default {
	components: {uniPopup},
	data() {
		return {
			content: '',
			Data:[],
			show: false,
			selector: [],
			beforeUserId:'',
			orderDetailId:'',
			storeId:''
		}
	}, 
	onLoad() {
		 uni.getStorage({
		 	key:'beforeUser',
		 	success: (res) => {
		 		this.beforeUserId = res.data.beforeUserId
		 	}
		 })
		 this.TowListCircle()
	},
	methods: {
		confirm(index){
			this.orderDetailId = this.selector[index].id
			console.log(this.orderDetailId)
		},
		TowListCircle(){
			uni.request({
				url: 'http://localhost:9090/before/bgs/store/TowListCircle',
				method: 'GET',
				data:{
					beforeUserId: this.beforeUserId,
				},
				success: (res) => {
					this.Data = res.data.data.list
					console.log(this.Data)
					for (let var1 in this.Data[0].orderDetails) {
						this.selector.push({id:this.Data[0].orderDetails[var1].orderDetailId,cateName:this.Data[0].orderDetails[var1].orderDetailName})
					}
					this.storeId = this.Data[0].storeId
				}
			});
		},
		TowFaBu(){
			uni.request({
				url: 'http://localhost:9090/before/bgs/circle/TowAddCircle',
				method: 'POST',
				data:{
					content: this.content,
					orderDetailId: this.orderDetailId,
					beforeUserId: this.beforeUserId,
					storeId: this.storeId
				},
				success: (res) => {
					console.log("发布成功")
				}
			});
		},
		showModule(){
			this.$refs.module.open()
		},
		iShow(){
			this.show = true
		}
	}
}
</script>

<style lang="scss" scoped>
.container{
	height: 100vh;
	overflow: hidden;
}

.body{
	padding: 30rpx;
	overflow-y: auto;
	height: calc(100vh - 88rpx - var(--status-bar-height));
	
	.protocol{
		align-items: flex-start;
		
		.text{
			color: #999;
			font-size: 28rpx;
			width: calc(100% - 60rpx);
		}
	}	
	.items{
		padding: 20rpx 0;
		
		.item{
			height: 100rpx;
			border-bottom: 2rpx solid #F2F2F2;
			
			.label{
				color: #666;
				font-size: 30rpx;
				margin-left: 20rpx;
			}
			
			.value{
				color: #999;
				font-size: 28rpx;
			}
		}
	}
	.content{
		height: 200rpx;
		font-size: 28rpx;
		padding: 20rpx 30rpx;
		border-radius: 10rpx;
		width: calc(100% - 60rpx);
		background-color: #F9F9F9;
	}	
}
</style>
